<template>
  <div class="common-layout">
    <el-container>

      <el-aside width="70px" style="position: relative; height: auto" >

        <div style="position: fixed; top: 0;left: 0">
          <el-menu  active-text-color="orange" text-color="white" style="background-color:cadetblue">
            <el-menu-item style="height: 65px" >
              <img src="/imgs/plant/Group月 50.png" style="width: 40px;margin-left: -8px"/>
            </el-menu-item>
            <el-menu-item index="1" style="margin-top: 10px">
              <el-col>
                <el-row><img src="/imgs/ERP图标/房子.png" width="20" style="margin-left: 3px;margin-top: 10px"/></el-row>
                <el-row style="margin-top: -15px">首页</el-row>
              </el-col>
            </el-menu-item>
            <el-menu-item index="2">
              <el-col>
                <router-link to="/home/market">
                <el-row><img src="/imgs/ERP图标/用户管理.png" width="20" style="margin-left: 3px;margin-top: 10px"/></el-row>
                <el-row style="margin-top: -15px">销售</el-row>
                </router-link>
              </el-col>
            </el-menu-item>
            <el-menu-item index="3">
              <el-col>
                <router-link to="/home/purchase">
                <el-row><img src="/imgs/ERP图标/实时开发.png" width="20" style="margin-left: 3px;margin-top: 10px"/></el-row>
                <el-row style="margin-top: -15px">采购</el-row>
                </router-link>
              </el-col>
            </el-menu-item>
            <el-menu-item index="4">
              <el-col>
                <router-link to="/home/inventory">
                <el-row><img src="/imgs/ERP图标/数据质量.png" width="20" style="margin-left: 3px;margin-top: 10px"/></el-row>
                <el-row style="margin-top: -15px">库存</el-row>
                </router-link>
              </el-col>
            </el-menu-item>
            <el-menu-item index="5">
              <el-col>
                <router-link to="/home/capital">
                <el-row><img src="/imgs/ERP图标/指标对账.png" width="20" style="margin-left: 3px;margin-top: 10px"/></el-row>
                <el-row style="margin-top: -15px">资金</el-row>
                </router-link>
              </el-col>
            </el-menu-item>
            <el-menu-item index="6">
              <el-col>
                <router-link to="/home/statement">
                <el-row><img src="/imgs/ERP图标/指标管理.png" width="20" style="margin-left: 3px;margin-top: 10px"/></el-row>
                <el-row style="margin-top: -15px">报表</el-row>
                </router-link>
              </el-col>
            </el-menu-item>
            <el-menu-item index="7">
              <el-col>
                <router-link to="/home/data">
                <el-row><img src="/imgs/ERP图标/档案库.png" width="18" style="margin-left: 4.5px;margin-top: 10px"/></el-row>
                <el-row style="margin-top: -15px">资料</el-row>
                </router-link>
              </el-col>
            </el-menu-item>
            <el-menu-item index="8">
              <el-col>
                <router-link to="/home/set">
                  <el-row><img src="/imgs/ERP图标/菜单管理.png" width="20" style="margin-left: 3px;margin-top: 10px"/></el-row>
                  <el-row style="margin-top: -15px">设置</el-row>
                </router-link>
              </el-col>
            </el-menu-item>

          </el-menu>
        </div>



      </el-aside>


      <el-container>
        <el-header style="display: flex; align-items: center; width: auto;">
          <div style="flex: 1;">
            <h1 style="font-size: 28px; margin: 0;">欢迎{}来到{}分店</h1>
          </div>

          <div style="text-align: right;">
            <span>
              <el-popover v-if="user==null" placement="left" :width="200">
                <template #reference>
                  <el-icon size="38"><User/></el-icon>
                </template>
                <div style="text-align: center;">
                  <el-button type="primary" @click="router.push('/reg')">注册</el-button>
                  <el-button type="warning" @click="router.push('/login')">登录</el-button>
                </div>
              </el-popover>
              <el-popover v-else placement="bottom" title="欢迎访问烘焙坊" :width="200">
                <template #reference>
                  <el-icon style="margin-top: 28px" size="25"><User/></el-icon>
                </template>
                <div style="text-align: center;">
                  <el-avatar :src="'http://localhost:8082'+user.imgUrl"></el-avatar>
                  <br>
                  <el-button type="info" size="small" @click="router.push('/personal')">个人中心</el-button>
            <el-button type="error" size="small" @click="logout()">退出登录</el-button>
          </div>
        </el-popover>
      </span>
          </div>
        </el-header>

        <el-main><router-view/></el-main>
      </el-container>


    </el-container>
  </div>
</template>


<script setup>

</script>


<style>
.el-menu-item:hover {
  background-color: cadetblue !important;
}
</style>

